<!doctype html>
<html lang="en">
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="x-rim-auto-match" content="none">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="stylesheet" href="css/style.css">
    <title>活动中心</title>
</head>

<body>

<div  id="activity">

<!--<div  class="activity" style='background-image: url(img/activity.jpg)'>-->
<!--　　<div  class="activityText">-->
        <!--<div>汇诚金服2016年上半年运营报告</div>-->
        <!--<div>诚金</div>-->
    <!--</div>-->
<!--</div>-->

</div>

</body>
<script>
window.onload= function () {

    function setHeight() {
        var w = document.documentElement.clientWidth;
        var h = document.documentElement.clientHeight;
        var activity = document.querySelectorAll('.activity');
        var activityText = document.querySelectorAll('.activityText');

        for (var i = 0; i < activity.length; i++) {
//            activity[i].style.height=402*w/750+'px';
            activity[i].style.height = h / 3 + 'px';
        }
        for (var j = 0; j < activityText.length; j++) {
//            activityText[j].style.paddingTop=150*w/750+'px';
            activityText[j].style.lineHeight = h / 3 + 'px';
        }
    }

    var slider = document.getElementById('activity');
    var pageNum = 1;
    var allPage = 1;
    var pageSize = 3;

    showAjax(1);

    function showAjax(pageNum){
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4) {
                if (xmlhttp.status == 200) {
                    data = eval("(" + xmlhttp.responseText + ")");
                    console.log(data);

                    if(data.list.length==0){
                        document.querySelector('#activity').innerHTML='<h2 style="text-align:center;padding-top:50px;">没有活动哦</h2>';
                    }


                    var strhtml = '';
                    for (var i = 0; i < data.list.length; i++) {
                        strhtml += '<a href="' + data.list[i].pictureUrl + '"><div class="activity" style="background-image: url(' + data.list[i].picturePath + ')"> ' +
                                '<div  class="activityText">' +
                                '<div>' + data.list[i].pictureName + '</div>' +
                                '</div></div></a>'
                    }

                    slider.innerHTML += strhtml;
                    setHeight();

                    allPage = data.paginator.navigatepageNums.length;

                }

            }
        };
        xmlhttp.open("POST","/mobile/activity/list", true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send('pageNum=' +pageNum+'&pageSize='+pageSize);
    }

    window.onscroll = function () {
        pageNum++;

        if (pageNum <= allPage) {

            showAjax(pageNum);

        } else{
            return
        }


    };
}
</script>
</html>